{% extends "member/layout.html" %}

{% block content %}
<div class="container-fluid">
    <div class="row mb-4">
        <div class="col">
            <h2 class="mb-0">工作台</h2>
            <small class="text-muted">欢迎回来，{{ session.member_name }}！</small>
        </div>
    </div>


    <div class="row mb-4">
        <div class="col-md-3 mb-3">
            <div class="card dashboard-card">
                <div class="card-body text-center p-4">
                    <div class="text-muted mb-2">我的项目</div>
                    <div class="stat-number">0</div>
                </div>
            </div>
        </div>
        <div class="col-md-3 mb-3">
            <div class="card dashboard-card">
                <div class="card-body text-center p-4">
                    <div class="text-muted mb-2">我的任务</div>
                    <div class="stat-number">0</div>
                </div>
            </div>
        </div>
        <div class="col-md-3 mb-3">
            <div class="card dashboard-card">
                <div class="card-body text-center p-4">
                    <div class="text-muted mb-2">已完成任务</div>
                    <div class="stat-number">0</div>
                </div>
            </div>
        </div>
        <div class="col-md-3 mb-3">
            <div class="card dashboard-card">
                <div class="card-body text-center p-4">
                    <div class="text-muted mb-2">完成率</div>
                    <div class="stat-number">0%</div>
                </div>
            </div>
        </div>
    </div>


    <!-- 项目列表 -->
    <div class="row">
        <div class="col-md-6">
            <div class="card dashboard-card">
                <div class="card-header">
                    <h5 class="mb-0">我的项目</h5>
                </div>
                <div class="card-body">
                    {% if projects %}
                    <div class="list-group list-group-flush">
                        {% for project in projects %}
                        <a href="{{ url_for('member.jira.project_detail', project_id=project.id) }}" class="list-group-item list-group-item-action">
                            <div class="d-flex justify-content-between">
                                <h6 class="mb-1">{{ project.name }}</h6>
                                <small class="text-muted">{{ project.created_at|format_date }}</small>
                            </div>
                            <small class="text-muted">{{ project.description|truncate(60) }}</small>
                        </a>
                        {% endfor %}
                    </div>
                    {% else %}
                    <div class="text-center py-4">
                        <i class="fas fa-folder-open fa-2x text-muted mb-3"></i>
                        <p class="text-muted">暂无项目</p>
                        <a href="{{ url_for('member.jira.create_project') }}" class="btn btn-sm btn-primary">创建项目</a>
                    </div>
                    {% endif %}
                </div>
            </div>
        </div>

        <!-- 任务列表 -->
        <div class="col-md-6 mt-4 mt-md-0">
            <div class="card dashboard-card">
                <div class="card-header">
                    <h5 class="mb-0">我的任务</h5>
                </div>
                <div class="card-body">
                    {% if False and tasks %}
                    <div class="list-group list-group-flush">
                        {% for task in tasks %}
                        <div class="list-group-item">
                            <div class="d-flex justify-content-between">
                                <h6 class="mb-1">{{ task.name }}</h6>
                                <small class="text-muted">截止: {{ task.due_date|format_date if task.due_date else '无' }}</small>
                            </div>
                            <small class="text-muted">项目: {{ task.stage.project.name }}</small>
                            <div class="progress mt-2" style="height: 8px;">
                                <div class="progress-bar" role="progressbar" style="width: {{ task.progress }}%;" aria-valuenow="{{ task.progress }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <div class="d-flex justify-content-between mt-2">
                                <small>进度: {{ task.progress }}%</small>
                                <button class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" data-bs-target="#progressModal" data-task-id="{{ task.id }}">更新</button>
                            </div>
                        </div>
                        {% endfor %}
                    </div>
                    {% else %}
                    <div class="text-center py-4">
                        <i class="fas fa-check-circle fa-2x text-muted mb-3"></i>
                        <p class="text-muted">暂无任务</p>
                    </div>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>
</div>

<!-- 更新进度模态框 -->
<div class="modal fade" id="progressModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">更新任务进度</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form id="progressForm">
                    <input type="hidden" name="task_id" id="taskId">
                    <div class="mb-3">
                        <label class="form-label">进度 (%)</label>
                        <input type="range" class="form-range" min="0" max="100" name="progress" id="progressSlider">
                        <div class="text-center">
                            <span id="progressValue">0</span>%
                        </div>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">备注</label>
                        <textarea class="form-control" name="notes" rows="3"></textarea>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" id="submitProgress">提交</button>
            </div>
        </div>
    </div>
</div>

<script>
    $(document).ready(function() {
        // 进度滑块事件
        $('#progressSlider').on('input', function() {
            $('#progressValue').text($(this).val());
        });

        // 模态框显示时设置任务ID
        $('#progressModal').on('show.bs.modal', function(event) {
            var button = $(event.relatedTarget);
            var taskId = button.data('task-id');
            $('#taskId').val(taskId);
        });

        // 提交进度
        $('#submitProgress').click(function() {
            var taskId = $('#taskId').val();
            var formData = $('#progressForm').serialize();
            $.ajax({
                url: "/member/task/" + taskId + "/progress",
                type: 'POST',
                data: formData,
                success: function(response) {
                    if (response.status === 'success') {
                        $('#progressModal').modal('hide');
                        location.reload(); // 刷新页面
                    } else {
                        alert('提交失败: ' + response.message);
                    }
                },
                error: function() {
                    alert('请求失败，请重试');
                }
            });
        });
    });
</script>
{% endblock %}